<template>
	<view class="wrap">
		<view class="header">
			<view class="userinfo">
				<!-- <view class="image" @click="navTo('info')"> -->
				<view class="image">
					<u-avatar size="100" :src="avatarUrl"></u-avatar>
				</view>
				<view class="info" style="display: flex;justify-content: space-between;">
					<view>
						<view class="username">{{ vuex_user.nickName }}</view>
						<view v-if="vuex_user.remark" class="usercode" flex="cross:center main:center">
							{{ vuex_user.remark || '' }}
						</view>
					</view>
					<view class="sign-in-images">
						<image src="/static/aidex/images/sign-in.png"></image>
					</view>
				</view>
			</view>
			<!-- 			<u-row class="userinfo-topbox" gutter="16" justify="center">
				<u-col span="4" text-align="center">
					<view class="number">{{totalData.dictCout}}<em>个</em></view>
					<view>相关模块数</view>
				</u-col>
				<u-col span="4" text-align="center" @click="navTo('/pages/sys/application/recharge')">
					<view class="number">{{totalData.imgCount}}<em>张</em></view>
					<view>我的照片</view>
				</u-col>
				<u-col span="4" text-align="center" @click="navTo('/pages/sys/application/balance-details')">
					<view class="number">{{totalData.archivesCount}}<em>卷</em></view>
					<view>相关案卷</view>
				</u-col>
			</u-row> -->
		</view>
		<view class="list">
			<view class="personal-list" @click="handleClick">
				<view class="item cell card"><text>关于我们</text></view>
			</view>
			<view class="personal-list" v-if="show">
				<view>当前地址：{{vuex_config.baseUrl}}</view>
				<input v-model="testText" type="text" />
				<button @click="testConfirm">修改</button>
			</view>
			<view class="botoom">
				<view class="item cell card cell-disabled"><text>切换用户</text></view>
				<view class="item cell card" @click="logout"><text>退出账户</text></view>
			</view>
			<view v-if="false">
				<u-cell-group class="personal-list">
					<!-- 					<u-gap height="20" bg-color="#f5f5f5"></u-gap>
					<u-cell-item icon="question-circle" :iconStyle="{ color: '#ff8d06' }" title="常见问题"
						@click="navTo('problem')"></u-cell-item>
					<u-cell-item icon="kefu-ermai" :iconStyle="{ color: '#5f8dff' }" title="意见反馈"
						@click="navTo('comment')"></u-cell-item>
					<u-cell-item icon="map" :iconStyle="{ color: '#316ede' }" title="账号安全" @click="navTo('pwd')">
					</u-cell-item>
					<u-cell-item icon="order" :iconStyle="{ color: '#59bdf9' }" title="清除缓存"
						@click="navTo('clear-cache')"></u-cell-item>
					<u-cell-item icon="account" :iconStyle="{ color: '#27c0dc' }" title="关于我们" @click="navTo('about')">
					</u-cell-item>-->
					<!-- <u-cell-item icon="kefu-ermai" :iconStyle="{ color: '#ff8a00' }" title="联系客服"
						@click="navTo('service')"></u-cell-item>
					<u-gap height="20" bg-color="#f5f5f5"></u-gap> -->
					<!-- <u-cell-item icon="setting" :iconStyle="{ color: '#2767dc' }" title="系统设置"
						@click="navTo('setting')"></u-cell-item> -->
					<u-cell-item class="card" icon="account" :iconStyle="{ color: '#27c0dc' }" title="关于我们" @click="navTo('about')">
					</u-cell-item>
					<!-- 					<u-cell-item icon="setting" :iconStyle="{ color: '#2767dc' }" title="录音"
						@click="navTo('../../../pagesA/base/lawEnforce/index')"></u-cell-item> -->
				</u-cell-group>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		mapGetters
	} from "vuex"
	import config from '@/common/config.js'
	export default {
		data() {
			return {
				iconSize: 38,
				totalData: {
					archivesCount: 0,
					dictCout: 0,
					imgCount: 0,
				},
				firstClickTime: null,
				clickCount: 0,
				clickInterval: 5000,
				testText: '',
				maxClicks: 5,
				show: false
			};
		},
		onLoad() {
			uni.hideTabBar()
			if (this.isNetworkConnected) {
				this.getPersonData()
			}
		},
		computed: {
			...mapGetters(['isNetworkConnected']),
			avatarUrl() {
				if (!this.vuex_user.avatar) {
					return '/static/aidex/images/user01.png'
				}
				// let url = this.vuex_user.avatarUrl || '/ctxPath/static/images/user1.jpg';
				// url = url.replace('/ctxPath/', this.vuex_config.baseUrl + '/');
				// let url = this.vuex_config.baseUrl + this.vuex_user.avatar || '/static/aidex/tabbar/my_2.png';
				let url = this.vuex_config.baseUrl + this.vuex_user.avatar
				url = this.replaceAll(url, '\\', '/');
				return url + '?t=' + new Date().getTime();
			}
		},
		onNavigationBarButtonTap(e) {
			uni.switchTab({
				url: '/pages/sys/home/index'
			});
		},
		methods: {
			handleClick() {
				const currentTime = new Date().getTime();
				console.log(this.firstClickTime);
				if (this.firstClickTime === null) {
					// 如果是第一次点击，则记录时间  
					this.firstClickTime = currentTime;
				} else if (currentTime - this.firstClickTime <= this.clickInterval) {
					// 如果是在一秒钟内点击的，则增加点击次数  
					this.clickCount++;
					if (this.clickCount === this.maxClicks) {
						// 执行操作  
						console.log('你成功了哎');
						// 重置点击计数和首次点击时间  
						this.clickCount = 0;
						this.firstClickTime = null;
						this.show = true
						this.testText = this.vuex_config.baseUrl
					}
				} else {
					// 如果超过一秒钟，则重置点击计数和首次点击时间  
					this.clickCount = 1; // 重置为1，因为用户已经点击了一次  
					this.firstClickTime = currentTime;
				}
			},
			testConfirm() {
				this.$u.vuex('vuex_token', '');
				config.baseUrl = this.testText
				this.vuex_config.baseUrl = this.testText
			},
			getPersonData() {
				this.$u.api.archives.getPersonData().then(res => {
					if (res.code == 200) {
						this.totalData = res.data
					}
				})
			},
			navTo(url) {
				uni.navigateTo({
					url
				});
			},
			logout() {
				if (this.isNetworkConnected) {
					this.$u.api.logout().then(res => {
						this.$u.toast(res.msg);
						if (res.code == '200') {
							uni.removeStorage({
								key: 'isLogin',
								success: function(res) {
									setTimeout(() => {
										uni.reLaunch({
											url: '/pages/sys/login/index'
										});
									}, 500);
								}
							});
						}
					});
				} else {
					uni.removeStorage({
						key: 'isLogin',
						complete: (e) => {
							setTimeout(() => {
								uni.reLaunch({
									url: '/pages/sys/login/index'
								});
							}, 500);
						}
					});
				}
			},
			upgrade() {
				// #ifdef APP-PLUS
				this.$u.api.upgradeCheck().then(res => {
					if (res.result == 'true') {
						uni.showModal({
							title: '提示',
							content: res.message + '是否下载更新？',
							showCancel: true,
							success: function(res2) {
								if (res2.confirm) {
									plus.runtime.openURL(res.data.apkUrl);
								}
							}
						});
					} else {
						this.$u.toast(res.message);
					}
				});
				// #endif
				// #ifndef APP-PLUS
				this.$u.toast('小程序端或H5端无需检查更新')
				// #endif
			}
		}
	};
</script>
<style lang="scss">
	@import 'index.scss';

	.wrap .u-cell-box .u-cell_title {
		color: #202328;
	}

	.sign-in-images {
		width: 125rpx;
		height: 50rpx;
		position: absolute;
		right: 0;
		top: 5px;

		uni-image {
			width: 125rpx;
			height: 50rpx;
		}
	}

	.list {
		height: calc(100vh - 44px - 55px);
		padding: 26rpx 32rpx;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;

		.cell {
			width: 100%;
			height: 88rpx;
			color: $u-content-color;
			font-size: 28rpx;
		}

		.cell-disabled {
			background-color: #ddd;
		}

		.personal-list {
			flex: 1;

			.item {
				display: flex;
				align-items: center;
				padding-left: 40rpx;
			}
		}

		.botoom {
			.item {
				display: flex;
				align-items: center;
				justify-content: center;
				margin-top: 32rpx;
			}
		}
	}
</style>